<template>
	<view>
		<van-tabs :active="active" @click="onClick">
			<van-tab title="审核中"></van-tab>
			<van-tab title="已发布"></van-tab>
			<van-tab title="进行中"></van-tab>
			<van-tab title="已完成"></van-tab>
		</van-tabs>
		<view v-if="active==0 || active == 1">
			<u-empty mode="data" text="暂无记录" margin-top="200" v-if="(active==1 || active == 2) && !goodsList.length" />
			<view v-for="item in goodsList" :key="item.goodsId">
				<van-swipe-cell right-width="65" @click="item.isDonation==0 ? NeedDetail(item) : DonateDetail(item)">
					<view class="item">
						<image :src="item.picture">
						</image>
						<view class="right">
							<span class="title">
								{{item.title}}
							</span>
							<span class="author">
								新旧程度: {{item.author}}
							</span>
							<span class="message">
								{{item.goodsDesc}}
							</span>
						</view>
						<view class="tag">
							<u-tag text="收" plain size="mini" type="warning" v-if="item.isDonation==0"></u-tag>
							<u-tag text="捐" plain size="mini" type="success" v-else></u-tag>
						</view>
					</view>
					<view slot="right" class="delete" @click.stop="deleteCollection(item.goodsId)">
						<u-button type="error" text="删除"></u-button>
					</view>
				</van-swipe-cell>
			</view>
		</view>
		<view v-else-if="active==2">
			<u-empty mode="data" text="暂无记录" margin-top="200" v-if="!orderList.length" />
			<view v-for="item in orderList" :key="item.orderId">
				<van-swipe-cell right-width="65" @click="orderDetail(item)">
					<view class="item">
						<image :src="item.goods.picture">
						</image>
						<view class="right">
							<span class="title">
								{{item.goods.title}}
							</span>
							<span class="author">
								新旧程度: {{item.goods.author}}
							</span>
							<span class="message">
								{{item.goods.goodsDesc}}
							</span>
						</view>
						<view class="tag">
							<u-tag text="收" plain size="mini" type="warning" v-if="item.goods.isDonation==0"></u-tag>
							<u-tag text="捐" plain size="mini" type="success" v-else></u-tag>
						</view>
					</view>
					<view slot="right" class="delete" @click.stop="deleteCollection(item.goodsId)">
						<u-button type="error" text="删除"></u-button>
					</view>
				</van-swipe-cell>
			</view>
		</view>
		<view v-else>
			<u-empty mode="data" text="暂无记录" margin-top="200"/>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				active: 0,
				goodsList: [
					// 	{
					// 	title: '你当像鸟飞往你的山',
					// 	author: '(美)塔拉·韦斯特弗',
					// 	picture: 'https://bookcover.yuewen.com/qdbimg/349573/1016713356/180',
					// 	goodsDesc: '比尔·盖茨年度特别推荐，登顶《纽约时报》畅销榜80周！人们只看到我的与众不同：一个十七岁前从未踏入教室的大山女孩，却戴上一顶学历的高帽，熠熠生辉。只有我知道自己的真面目：不上学，不就医，是父亲要我们坚持的忠诚与真理。父亲不允许我们拥有自己的声音，我们的意志是他眼中的恶魔',
					// 	isDonation: 1
					// },
				],
				orderList: []
			};
		},
		onLoad(options) {
			this.active = Number(options.index)
		},
		onShow() {
			this.getList()
		},
		methods: {
			// 点击tab导航项时触发
			onClick(e) {
				this.active = e.detail.index
				console.log(this.active);
				this.getList()
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 200
				})
			},
			// 获取不同状态的物品列表
			async getList() {
				 if (this.active == 0) {
					let {
						data: res
					} = await this.$myRequest({
						url: '/TypeCheck/getAuditGoods/' + uni.getStorageSync('userId')
					})
					if (res.code == 20000) {
						console.log(res.data.goods);
						this.goodsList = res.data.goods
					}
				} else if (this.active == 1) {
					let {
						data: res
					} = await this.$myRequest({
						url: '/TypeCheck/publishGoods/' + uni.getStorageSync('userId')
					})
					if (res.code == 20000) {
						console.log(res.data.goods);
						this.goodsList = res.data.goods
					}
				}else if(this.active == 2){
					let {
						data: res
					} = await this.$myRequest({
						url: '/TypeCheck/getOrdering/' + uni.getStorageSync('userId')
					})
					if (res.code == 20000) {
						console.log(res.data.order);
						this.orderList = res.data.order	
					}
				}

			},
			// 跳转到捐赠详情页
			DonateDetail(info) {
				uni.navigateTo({
					url: '/page_index/DonateDetail?info=' + encodeURIComponent(JSON.stringify(info))
				})
			},
			// 跳转到需求详情页
			NeedDetail(info) {
				uni.navigateTo({
					url: '/page_index/NeedDetail?info=' + encodeURIComponent(JSON.stringify(info))
				})
			},
			// 跳转到订单详情页
			orderDetail(info){
				uni.navigateTo({
					url:'/pages/OrderDetail?info='+ encodeURIComponent(JSON.stringify(info))
				})
			}
		}

	}
</script>

<style lang="scss" scoped>
	/deep/ .van-tabs__line {
		background-color: #d81e06;
	}

	/deep/ .van-ellipsis {
		font-size: 28rpx;
		font-weight: bold;
		title-inactive-color: #8a8a8a;
		border-radius: 30rpx;
	}

	.item {
		border-radius: 20rpx;
		background-color: #fff;
		margin: 10rpx 20rpx;
		height: 250rpx;
		width: 710rpx;
		display: flex;

		image {
			width: 160rpx;
			height: 200rpx;
			margin: 20rpx 20rpx;
		}

		.right {
			margin-left: 20rpx;
			width: 65%;

			.title {
				display: block;
				color: #d81e06;
				margin-top: 20rpx;
				font-size: 28rpx;
				font-weight: bold;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
			}

			.author {
				display: block;
				font-size: 24rpx;
				color: gray;
				margin-top: 20rpx;
			}

			.message {
				font-size: 24rpx;
				margin-top: 20rpx;
				overflow: hidden;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
				text-overflow: ellipsis;
			}
		}

		.tag {
			margin-right: 20rpx;
			margin-top: 190rpx;
		}
	}
</style>
